<template>
  <div class="home clearfix">
    <AdvertBar></AdvertBar>
    <section class="school-publicity w1400 clearfix mt50">
      <h2 class="border-title">武汉大学招生直播专栏</h2>
      <div class="card-container mt50">
        <VideoCard
          @click.native="goVideoPlay(index)"
          @mouseenter.native="hover(publicity)"
          @mouseleave.native="hoverLeave(publicity)"
          v-for="(publicity, index) in publicityList" :key="'publicity'+index"
          :item="publicity"
          :showVideo="true"
          title-class="clamp2-ellipsis"
        ></VideoCard>
      </div>
    </section>
  </div>
</template>

<script>
import AdvertBar from '../../components/AdvertBar'
import VideoCard from '../home/comp/VideoCard'
import { checkLogin } from '../../utils/checkLogin'
export default {
  name: 'wuhanSchool',
  components: {
    AdvertBar,
    VideoCard
  },
  data () {
    return {
      schoolList: [],
      publicityList: [
        {"title":"测绘学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-测绘学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-测绘学院.png"},
        {"title":"城市设计学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-城市设计学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-城市设计学院.png"},
        {"title":"电气与自动化学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-电气与自动化学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-电气与自动化学院.png"},
        {"title":"法学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-法学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-法学院.png"},
        {"title":"国家网络安全学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-国家网络安全学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-国家网络安全学院.png"},
        {"title":"化学与分子科学学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-化学与分子科学学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-化学与分子科学学院.png"},
        {"title":"基础医学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-基础医学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-基础医学院.png"},
        {"title":"计算机学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-计算机学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-计算机学院.png"},
        {"title":"健康学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-健康学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-健康学院.png"},
        {"title":"历史学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-历史学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-历史学院.png"},
        {"title":"马克思主义学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-马克思主义学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-马克思主义学院.png"},
        {"title":"社会学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-社会学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-社会学院.png"},
        {"title":"生命科学学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-生命科学学院01.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-生命科学学院01.png"},
        {"title":"数学与统计学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-数学与统计学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-数学与统计学院.png"},
        {"title":"水利水电学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-水利水电学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-水利水电学院.png"},
        {"title":"土木建筑工程学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-土木建筑工程学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-土木建筑工程学院.png"},
        {"title":"外国语言文学学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-外国语言文学学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-外国语言文学学院.png"},
        {"title":"文学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-文学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-文学院.png"},
        {"title":"物理科学与技术学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-物理科学与技术学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-物理科学与技术学院.png"},
        {"title":"新闻与传播学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-新闻与传播学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-新闻与传播学院.png"},
        {"title":"信息管理学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-信息管理学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-信息管理学院.png"},
        {"title":"遥感信息工程学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-遥感信息工程学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-遥感信息工程学院.png"},
        {"title":"药学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-药学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-药学院.png"},
        {"title":"医学部","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-医学部.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-医学部.png"},
        {"title":"哲学学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-哲学学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-哲学学院.png"},
        {"title":"政治与公共管理学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-政治与公共管理学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-政治与公共管理学院.png"},
        {"title":"资源与环境科学学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-资源与环境科学学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WHU-资源与环境科学学院.png"},
        {"title":"经济与管理学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-经济与管理学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/WUH-经济与管理学院.png"},
        {"title":"电子信息学院","videoSrc":"http://zyfiles.ubzyw.com/video/WHU-电子信息学院.mp4","imgSrc":"http://zyfiles.ubzyw.com/video/电子信息学院.png"},
      ]
    }
  },
  methods: {
    goVideoPlay (index) {
      window.open(`#/videoPlay?index=${index}&j=1`)
    },
    hover (item) {
      this.$set(item, 'show', true)
    },
    hoverLeave (item) {
      this.$set(item, 'show', false)
    },
  }
}
</script>

<style  lang="less">
  .home {
    .home-nav {
      background: rgba(0, 0, 0, .3);
      box-shadow: none;

      .nav-title {
        p {
          color: #fff;
        }
      }

      .nav-list {
        li {
          color: #fff;
        }
      }

      .login-register {
        color: #fff;
      }

      .user-box {
        color: #fff;
      }
    }

    .important {
      .card-box {
        width: 452px;
      }

      .card-img {
        height: 339px;
      }

      .card-text {
        height: 105px;
      }

      .title {
        padding-top: 20px;
        padding-bottom: 16px;
      }
    }
    .his:hover{
      color:#FF6B51
    }
    .past-live {
      .card-box {
        width: 296px;
        margin-bottom: 16px;
      }

      .card-img {
        height: 166px;
      }

      .card-text {
        height: 48px;
      }

      .title {
        padding-top: 16px;
      }
    }

    .school-publicity, .major-intro {
      .card-box {
        width: 216px;
        margin-bottom: 16px;
      }

      .card-img {
        height: 120px;
      }

      .card-text {
        height: 48px !important;
      }

      .title {
        padding-top: 8px;
      }
    }
  }
</style>

<style scoped lang="less">
  .home {
    .border-title {
      font-size: 30px;
      color: #1F2329;
    }

    .card-container {
      margin-left: -20px;
      margin-top: 20px;
    }

    .important {
      float: left;
      width: 452px;
    }

    .past-live {
      float: right;
      width: 928px;
      margin-left: 20px;
    }

    .university-container {
      margin-left: -20px;
      margin-top: 20px;
    }

    .university-box {
      cursor: pointer;
      float: left;
      color: #1F2329;
      width: 335px;
      height: 104px;
      margin-left: 20px;
      box-sizing: border-box;
      border: 1px solid #EFF0F1;
      padding: 20px 36px;
      &:hover{
        background: #F5F6F7;
      }
      .university-box-content {
        margin-left: -10px;
        margin-right: -10px;
        margin-top: 12px;
      }

      img {
        float: left;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        margin-left: 10px;
        margin-right: 10px;
      }
    }
    .school-publicity, .major-intro {
      .card-text {
        height: 48px !important;
      }
    }
  }
</style>
